<template>
	<view>
		<view v-for="(mitem,mindex) in listData" :key='mindex' style="padding: 30rpx;">
			<view class="p-22-32 bg-eb">
				<view class="d-b-c mb16">
					<view class="f32 fb d-s-c" @click="monthShow = true">
						<text class="mr16">{{mitem.month}}</text>
						<image class="jiantou-down" style="width: 24rpx;height: 24rpx;" src="../../../static/jiantou-down.png" mode="aspectFill">
						</image>
					</view>
				</view>
			</view>
			<view class="p-0-32 item-box" v-for="(item,index) in mitem.lists" :key="index">
				<view class="p-30-0 border-b-d">
					<view class="d-b-c mb12">
						<view class="gray32 fb" style="display: flex;align-items: center;">
							<text class="unset-box">{{item.describe}}</text>
							<view class="title" v-if="item.from">
								来自下级 - {{item.from}}
							</view>
						</view>
						<view class="fb">{{item.money}}</view>
					</view>
					<view class="d-s-c gray-money" @click="copy(item.settled_no)">
						<text>交易号：{{item.settled_no?item.settled_no:''}}</text>
						<image class="jiantou-down" style="width: 24rpx;height: 24rpx;margin-left: 10rpx;" src="../../../static/copy.png" mode="aspectFill">
					</view>
					<view class="d-b-c">
						<view class="gray-time f24">{{item.format_create_time}}</view>
						<view class="gray-money f24 fb">余额{{item.balance}}</view>
					</view>
				</view>
				<view class="p-16-0">{{item.create_time}}</view>
			</view>
		</view>
		
		<u-picker mode="time" v-model="monthShow" :params="params" @confirm="changeMonth"></u-picker>
				
		<view v-if="listData.length<=0">
			<view class="ww100 tc f24 gray32 p20">暂无记录</view>
		</view>
		<!-- 没有记录 -->
		<view class="d-c-c p30" v-if="listData.length == 0 && !loading">
		</view>
		<uni-load-more v-else :loadingType="loadingType"></uni-load-more>
	</view>
</template>

<script>
    var _self;
	import uniLoadMore from "@/components/uni-load-more.vue";
	export default {
		components: {
			uniLoadMore
		},
		data() {
			return {
				no_more: false,
				loading: true,
				/*最后一页码数*/
				last_page: 0,
				/*当前页面*/
				page: 1,
				/*每页条数*/
				list_rows: 20,
				listData: [],
				monthShow: false,
				params: {
					year: true,
					month: true,
					day: false,
					hour: false,
					minute: false,
					second: false
				},
				month: ''
			}
		},
		computed: {
			/*加载中状态*/
			loadingType() {
				if (this.loading) {
					return 1;
				} else {
					if (this.listData.length != 0 && this.no_more) {
						return 2;
					} else {
						return 0;
					}
				}
			}
		},
		mounted() {
			/*获取数据*/
			this.getData();
		},
		onReachBottom() { //监听上拉触底事件
			let self = this;
			if (self.page < self.last_page) {
				self.page++;
				self.getData();
			}
			self.no_more = true;
		},
		methods: {
			getNowData(){
				return new Date()
			},
			changeMonth(e) {
				console.log(e)
				this.month = e.year+'-'+e.month
				this.listData = []
				this.getData()
			},
			/*获取数据*/
			getData() {
			    console.log('getData')
				let self = this;
				let page = self.page;
				self.loading = true;
				let list_rows = self.list_rows;
				let data = {
                    page: page || 1,
                    list_rows: list_rows,
                };

				self._post('user.Agent/getCapitalList', {
					page: page || 1,
					list_rows: list_rows,
					month: self.month
				}, function(res) {
					self.loading = false;
					
					if (self.listData.length > 0) {
					 	res.data.list.data.forEach((item, index) => {
					 		let flag = false;
					 		self.listData.forEach((litem, lindex) => {
					 			if (litem.month == item.month) {
					 				console.log('相同月份')
									
									if (litem.lists && litem.lists.length > 0) {
										litem.lists.push(item)
									} else {
										litem.lists = [item]
									}
									
					 				flag = true;
					 				return
					 			}
					 		})
					 	})
					} else {
					 	console.log('<=0')
						self.listData = res.data.monthList
						
						res.data.list.data.forEach((item, index) => {
							let flag = false;
							self.listData.forEach((litem, lindex) => {
								console.log(litem.month)
								if (litem.month == item.month) {
									console.log('相同月份')
									if (litem.lists && litem.lists.length > 0) {
										litem.lists.push(item)
									} else {
										litem.lists = [item]
									}
									
									flag = true;
									return
								}
								console.log(self.listData)
							})
						})
					}
					console.log(self.listData)
					self.last_page = res.data.list.last_page;
					if (self.page >= self.last_page) {
						self.no_more = true;
					}
					self.loading = false;
				});
			},
			copy(value) {
				if (value) {
					uni.setClipboardData({
					    //准备复制的数据
					    data: value,
					    success: function (res) {
					        uni.showToast({
					            title: '复制成功',
					        });
					    },
						fail(error) {
						}
					})
				}
			},
		}
	}
</script>

<style lang="scss">
	page {
		background: #ffffff;
	}
    .actday{
        border-bottom: 1px #FF4849 solid;
        .ditem{
            color: #FF4849;
        }
    }
    .day{
        .ditem{
            color: rgba(0, 0, 0, 0.69);
        }
    }
	
	.gray-time {
		color: rgba(0,0,0,0.3200);
	}
	
	.gray-money {
		color: #999999;
	}
	
	.title {
		display: flex;
		align-items: center;
		background: #F2F2F2;
		color: rgba(0,0,0,0.3200);
		border-radius: 18rpx;
		font-size: 20rpx;
		padding: 0 10rpx;
		margin-left: 10rpx;
		image {
			margin-left: 10rpx;
		}
	}

</style>
